<template>
  <div class="base-layout" :style="{ backgroundColor: bgColor }">
    <slot name="common" />
    <div class="scroll-content ios-safe-bottom">
      <slot name="scroll" />
    </div>
    <slot name="bottom" />
  </div>
</template>
<script setup>

defineProps({
  bgColor: {
    type: String,
    default: '#eeeeee'
  }
})
</script>
<style lang="scss" scoped>
.base-layout {
  display: flex;
  width: 100%;
  height: 100%;
  flex-flow: column nowrap;
  .scroll-content {
    overflow: auto;
    min-height: 0;
    flex: 1 0;
  }
}
</style>
